<script type="text/javascript">
$(function(){
	var pg = App.office.workIndex.ui, pp = pg.params = {},
		left = pg.children('.left'), right = pg.children('.right'),
		main = pg.children('.main'), lhd = left.children('.head'),
		lbd = left.children('.body'), lft = left.children('.foot'),
		rhd = right.children('.head'), rbd = right.children('.body'),
		days = lbd.children('.days'),
		minDate = new Date(new Date().format("yyyy-MM-dd")).getTime(),
		maxDate = 0, _work, DH = 32;
	
	rbd.scroll(function() {
		var s = this.scrollTop;
		lbd.scrollTop(s);
		main.children('.lane').children('.body').scrollTop(s);
	});
	pg.mousewheel(function(e, delta, deltaX, deltaY) {
		var s = rbd[0].scrollTop - deltaY * 8;
		lbd.scrollTop(s);
		rbd[0].scrollTop = s;
		main.children('.lane').children('.body').scrollTop(s);
		return false;
	});

// 	function rgb(){//rgb颜色随机
// 		var r = Math.floor(Math.random()*256);
// 		var g = Math.floor(Math.random()*256);
// 		var b = Math.floor(Math.random()*256);
// 		var rgb = '('+r+','+g+','+b+')';
// 		return rgb;
// 	}
	//十六进制随机浅色
	function color16(){
		var r = Math.floor(128 + Math.random() * 128);
		var g = Math.floor(128 + Math.random() * 128);
		var b = Math.floor(128 + Math.random() * 128);
		return '#' + r.toString(16) + g.toString(16) + b.toString(16);
	}

	function adjust(){
		var h = pg.parent().height(),
			a = main.children('.lane').children('.body');
		pg.height(h);
		main.height(h).width(pg.width() - 128 - 18);
		left.height(h);
		right.height(h);
		h = h - 30 - 16;
		a.height(h);
		lbd.height(h);
		rbd.height(h);
		h = days.height();
		rbd.children().height(h);
		// 更新所有lane body内撑杆的高度
		a.children('.bar').height(h);
	}
	$(window).resize(adjust);
	adjust();

	function calcTop(a, b){
		return (Math.floor(a/86400000)  - Math.floor(b/86400000)) * 32;
	}
	function yyyyMMdd(d){
		return new Date(d).format('yyyy-MM-dd');
	}
	function day(d, t, psd, ped, asd, aed) {
		var z = yyyyMMdd(d);
		var a = $('<div class="day"></div>'),
			x = $('<div class="text"></div>');
		a.attr('name', z).addClass('type' + Cache.office.work.days[z]);
		if (!t) {
			a.addClass('out');
			x.append(z);
			a.append(x);
			//a.append(z);
			return a;
		}
		var c = $('<input type="checkbox"></input>'),
			l = t.logs[z] || { content: '' };
		if (App.logon.id == t.ownerId) {
			c.change(function(){
				var k = $(c).is(':checked');
				if (k) {
					s = prompt('任务一句话日志', '', t.title)
					if (!s) {
						return;
					}
				}
				x.children('span').text(s);
				$.post(App.office.ctx + '/work/log/save.do', {
					id: l.id,
					workId: t.id,
					time: z,
					content: s,
					status: k? 1:0
				}, function(rs){
					var ro = mac.eval(rs);
					if (!ro.success) {
						mac.alert('提交' + z + '工作日志失败');
					}
				});
			}).attr('name', z);
			x.append(c);
		}
		// 填充任务日志
		if (l.status) {
			c.attr('checked', true).attr('value', l.id);
			a.addClass('work');
		} else {
			a.addClass('out');
		}
		x.append('<span>' + (l.content || t.title) + '</span>');
		a.append(x);
		//a.append(z);
		//
		if (d >= psd && d <= ped) {
			a.addClass('plan');
		}
		if (d >= asd && d <= aed) {
			a.addClass('actural');
		}
		return a;
	}
	function init(lt){
		main.empty();
		// 遍历所有任务
		$.each(lt, function(i, work){
			// 取出当前任务的用户ID，XX日期
			var tid = work.id, oid = work.ownerId;
			// 查找当前用户的泳道是否存在
			var ul = main.seek(oid), lb;//user lane
			// 不存在则先创建
			if (!ul.length) {
				ul = $('<div class="lane"></div>');
				ul.attr('name', oid);
				var h = $('<div class="head"></div>');
				h.append(work.owner.name);
				ul.append(h);
				lb = $('<div class="body"></div>')
					.append('<div class="bar"></div>')
					.appendTo(ul);
				main.append(ul);
			} else {
				lb = ul.children('.body');
			}
			// 查找当前用户的泳道中是否存在该任务的列
			var tc = lb.seek(tid);//work column
			// 不存在则先创建
			if (!tc.length) {
				tc = $('<div class="work"></div>');
				tc.attr('name', tid).attr('title', work.title);
				tc.dblclick(function(){
					App.open({
						title: '编辑任务',
						ctx: 'office',
						action:'workEdit',
						model: true,
						params: work
					}, function(){
						load();
					});
				});
				tc.css('background-color', color16());
				//
				tc.draggable({
					revert: true,
					helper: 'clone',
					start: function(e){
						_work = work;
						tc.css('visibility', 'hidden');
						return true;
					},
					stop: function(e){
						tc.css('visibility', 'visible');
					}
				}).droppable({
					drop: function(){
						if (_work.ownerId != work.ownerId) {
							mac.alert('暂不支持跨用户的任务时间调整');
							return;
						}
						mac.confirm('确定要把"' + _work.title + '"排在"'
							+ work.title + '"之后吗？', function(){ 
							$.post(App.office.ctx + '/work/after.do', {
								workId: _work.id,
								afterWorkId: tid
							}, function(){
								load();
							});
						});
					}
				});
				lb.append(tc);
				if (work.afterWorkId) {
					var a = main.seek(work.afterWorkId);
					tc.css('left', a.css('left'));
				} else {
					if (lb.children('.work').length > 1) {
						ul.width(ul.width() + tc.width());
					}
					tc.css('left', ul.width() - 240);
				}
			}
			// 找出当前任务的最小和最大日期，并与当前最小日期计算差值
			var psd = work.planStartDate, ped = work.planEndDate;
// 			psd = psd ? new Date(psd).getTime() : yyyyMMdd(new Date());
// 			ped = ped ? new Date(ped).getTime() : yyyyMMdd(new Date());
			psd = new Date(psd).getTime();
			ped = new Date(ped).getTime();
			var asd = new Date(work.actualStartDate || psd).getTime(),
				aed = new Date(work.actualEndDate || ped).getTime(),
				sd = Math.min(psd, asd),
				ed = Math.max(ped, aed);
			asd = new Date(work.actualStartDate).getTime();
			aed = new Date(work.actualEndDate).getTime();
			// 看当前用户泳道内是否有同日期的任务
			if (lb.seek(yyyyMMdd(sd)).length) {
				// 如果有，说明任务需要并行
				tc.css('float', 'left');
			}
			// 存储当前任务的最小日期
			tc.data('min', sd);
			// 如果当前任务的最小日期小于当前全局最小日期，则需要在顶部补空行
			if (sd < minDate) {
				// 在所有用户泳道（除当前用户）中的所有任务列顶部插入日期
				main.find('.work').each(function(i, n){
					var a = $(n);
					if (a.attr('name') == oid) {
						return;
					}
// 					var m = new Date(i).format('yyyy-MM-dd');
// 					i = minDate + (a.seek(m).length? 86400000 : 0);
// 					for (; i >= sd; i -= 86400000) {
// 						a.prepend(day(i));
// 					}
					a.css('top', calcTop(sd, a.data('min')));
				});
				// 同时在最左侧日期列插入日期
				for (var i = minDate; i >= sd; i -= 86400000) {
					days.seek(yyyyMMdd(i)).remove()
					days.prepend(day(i));
				}
				//更新全局最小日期
				minDate = sd;
			} else {
				// 反之在当前任务列顶部补日期
// 				for (var i = minDate; i < sd; i += 86400000) {
// 					// 在当前任务列添加日期
// 					tc.append(day(i));
// 				}
				tc.css('top', calcTop(sd, minDate));
			}
			for (var i = sd; i <= ed; i += 86400000) {
				// 在当前任务列添加日期
				tc.append(day(i, work, psd, ped, asd, aed));
			}
			// 如果任务最大日期大于全局最大日期
			maxDate = Math.max(maxDate, minDate + 86400000);
			if (ed > maxDate) {
				// 则需要补最左侧的日期列
				var m = yyyyMMdd(maxDate);
				days.seek(m).remove();
				for (var i = maxDate; i <= ed; i += 86400000) {
					// 更新日期列，并避免重复
					days.seek(yyyyMMdd(i)).remove()
					days.append(day(i));
				}
				maxDate = ed;
			}
		});
		adjust();
	}

	function load(){
		var w = mac.wait('Loading');
		$.post(App.office.ctx + '/work/index.do', {
			pageNo: 1,
			pageSize: 10000,
			groupId: pp.groupId
		}, function(rs) {
			var ro = mac.eval(rs);
			if (ro.success) {
				init(ro.data.list);
			} else {
				mac.alert(ro.data, ro.params);
			}
			w.close();
		});
	}
	load();

	lhd.children('.add').click(function(){
		App.open({
			title: '添加任务',
			ctx: 'office',
			action:'workEdit',
			model: true
		}, function(){
			load();
		});
	});
	rhd.children('.groups').click(function(){
		App.open({
			title: '选择工作组',
			ctx: 'office',
			action: 'groupPicker',
			model: true,
			params: { multi: false }
		}, function(s){
			pp.groupId = s[0].id;
			load();
		});
	});
});
</script>
<div class="left">
	<div class="head">
		<div class="add">添加任务</div>
	</div>
	<div class="body">
		<div class="days"></div>
	</div>
	<div class="foot">
		<div class="days"></div>
	</div>
</div>
<div class="main">
</div>
<div class="right">
	<div class="head">
		<div class="groups">&nbsp;</div>
	</div>
	<div class="body">
		<div></div>
	</div>
</div>